<template>
	<view>
		<view class="repair-card" v-for="(item,index) in propsList.list" :key='item.id'>
			<view class="card-title" @tap="jumpDetail(item.id)">
				<view class="" style="flex:1">
					{{item.hospital.name}}
				</view>
				<view class="" style="color: #FFAB00;font-size: 28rpx;">
					<text v-if="item.status==2">待验收</text>

					<text v-if="item.status==2" style="color: #DADADA;"> {{' '}}| {{' '}}</text>
					<text>{{item.type_data}}</text>

				</view>
			</view>
			<view class="card-content" @tap="jumpDetail(item.id)">
				<image src="../static/finiash.png" v-if="item.status==3" class="finiash" mode=""></image>
				<view class="card-content-item">
					工单ID：<text class="attribute">{{item.workID||'暂无信息'}}</text>
				</view>
				<view class="card-content-item">
					暂停状态：<text class="attribute">{{item.open_data == 0 ? '暂停' : '开启'}}</text>
				</view>
				<view class="card-content-item">
					设备类别：<text class="attribute">{{item.equipment.pinpai.name||'暂无信息'}}</text>
				</view>
				<view class="card-content-item">
					品牌：<text class="attribute">{{item.equipment.leibie.name||'暂无信息'}}</text>
				</view>
				<view class="card-content-item" v-if="item.progress">
					维保次数：<text class="attribute">{{item.progress||'暂无信息'}}</text>
				</view>
				<view class="card-content-item" v-if="item.next_time">
					下次维保时间：<text class="attribute">{{item.next_time||'暂无信息'}}</text>
				</view>

				<view class="card-content-item">
					联系人：<text class="attribute">{{item.contacts||'暂无信息'}}</text>
				</view>
				<view class="card-content-item" style="display: flex;align-items: center;">
					<view class="" style="width: 38%;">联系电话：</view>
					<view class="" style="display: flex;align-items: center;" @tap="call(item.mobile)">
						<view class="" style="width: 16%;">
							<image v-if="item.mobile" src="@/static/phone.png" class="point_icon2" />
						</view>
						<view class="">
							<text style="color: #5180FF;" class="product-left-name-border">{{item.mobile||''}}</text>
						</view>
					</view>
				</view>

				<view class="card-content-item">
					型号：<text class="attribute">{{item.equipment.xinghao.name||'暂无信息'}}</text>
				</view>
				<view class="card-content-item">
					序列号：<text class="attribute">{{item.equipment.serial||'暂无信息'}}</text>
				</view>
				<view class="card-content-item">
					设备生产年份：<text class="attribute">{{item.equipment.create_date||'暂无信息'}}</text>
				</view>
				<view class="card-content-item">
					使用年限：<text class="attribute">{{item.equipment.use_year||'暂无信息'}}</text>
				</view>
				<view class="card-content-item">
					收款状态：<text class="attribute">{{item.collect_data == 0 ? '应收订单' : '已收款订单'}}</text>
				</view>

				<view class="card-content-item">
					亏损状态：<text class="attribute">{{item.is_loss == 1 ? '亏损' : '正常'}}</text>
				</view>
				<view class="card-content-item" v-if="item.commiss_sale != 0">
					销售提成次数：<text class="attribute">{{item.commiss_sale ||'暂无信息'}}</text>
				</view>
				<view class="card-content-item" v-if="item.commiss_eng != 0">
					工程师提成次数：<text class="attribute">{{item.commiss_eng ||'暂无信息'}}</text>
				</view>
				<view class="card-content-item" v-if="item.engineer.length>0||item.hxengineer.length>0" style="display: flex;width: 730rpx">
					<view style="width: 30%;height: 30rpx;">当前指派工程师：</view>
					<view style="width: 68%;display: flex;flex-wrap:wrap;">
						<text class="attribute" style="margin-right: 10rpx;" v-for="(i,index) in item.engineer">
							{{i.nickname||'-'}}
						</text>
						<text class="attribute" style="margin-right: 10rpx;" v-for="(i,index) in item.hxengineer">
							{{i.nickname||'-'}}
						</text>
					</view>
				</view>
				<view class="card-content-item" v-if="item.sale.length>0" style="display: flex;width: 730rpx">
					<view style="width: 26.6%;height: 30rpx;">当前指派销售：</view>
					<view style="width: 72%;display: flex;flex-wrap:wrap;">
						<view class="attribute" style="margin-right: 10rpx;" v-for="(i,index) in item.sale">
							{{i.nickname||'-'}}
						</view>
					</view>
				</view>

			</view>
			<view class="card-time">
				<view class="card-time-left"> {{item.createtime}} </view>
				<view class="" v-if="identity == 6">
					<view class="card-time-open" v-if="item.open_data != 0 " @tap="switchChange(item.id)">
						暂停 </view>
					<view class="card-time-close" v-if="item.open_data == 0 " @tap="switchChange(item.id)">
						开启 </view>
				</view>
				<view class="card-time-change" @click="open" @tap="transform(item.id)" v-if="IsType==0&&identity ==6">
					{{item.hxengineer.length == 0&&item.engineer.length == 0?'指派':'改派'}}
				</view>
				<view class="card-time-right" @tap="jumpDetail(item.id)"> 详情 </view>
			</view>
		</view>
		<uni-popup ref="popup" type="bottom">
			<view class="reassignment">
				<view class="choose">
					<text class="line"></text>
					<text class="text">工程师</text>
				</view>
				<select-cy :value="tval" placeholder="请选择工程师" :options="reassignment" @change="(e,a)=>change(e,a,1)"></select-cy>
				<view class="choose" style="margin-top: 40rpx;">
					<text class="line"></text>
					<text class="text">核心工程师</text>
				</view>
				<select-cy :value="tvalNew" placeholder="请选择核心工程师" :options="reassignNew"
					@change="(e,a)=>change(e,a,2)"></select-cy>
					<view class="choose" style="margin-top: 26rpx;">
						<text class="line"></text>
						<text class="text">销售</text>
					</view>
					<select-cy :value="tvalNew2" placeholder="请选择销售" :options="reassignNew2"
						@change="(e,a)=>change(e,a,3)"></select-cy>
				<button @tap="submit(id,value)" class="submit-btn" type="primary" size="mini">确认提交</button>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		name: "orderCard",
		/* 
		propsList.type：
		repair   维保工单 
		checkout   待验收
		
		*/
		props: {
			propsList: Object,
			IsType: {
				type: Number,
				default: 0
			},
			identity: {
				type: String,
				default: ''
			}
		},
		data() {
			return {
				value: 0, //工程师id
				tval: [],
				tvalNew: [],
				tvalNew2:[],
				reassignment: [],
				reassignNew: [],
				reassignNew2: [],
				engineer_id: [],
				id: null,
				newArr: [],
				newArr2: [],
				newArr3:[]
			}
		},
		methods: {
			/*改派订单*/
			async submit(id, value) {
				this.newArr = []
				this.newArr2 = []
				this.newArr3 = []
				this.reassignment.forEach((result, index) => {
					this.tval.forEach((item, idx) => {
						if (result.label == item) {
							if (this.newArr.indexOf(result.value) > -1) {
								this.newArr.splice(idx, 1)
							} else {
								this.newArr.push(result.value)
							}

						}
					})
				})
				this.reassignNew.forEach((result, index) => {
					this.tvalNew.forEach((item, idx) => {
						if (result.label == item) {
							if (this.newArr2.indexOf(result.value) > -1) {
								this.newArr2.splice(idx, 1)
							} else {
								this.newArr2.push(result.value)
							}
						}
					})
				})
				this.reassignNew2.forEach((result, index) => {
					this.tvalNew2.forEach((item, idx) => {
						if (result.label == item) {
							if (this.newArr3.indexOf(result.value) > -1) {
								this.newArr3.splice(idx, 1)
							} else {
								this.newArr3.push(result.value)
							}
						}
					})
				})

				if (this.newArr2.length == 0 && this.newArr.length == 0) {
					uni.showToast({
						title: '请选择工程师',
						icon: 'none'
					})
					return
				}
				await this.$https.post('/warranty/appoint', {
					warranty_id: this.id,
					engineer_id: this.newArr.toString(),
					hxengineer_id: this.newArr2.toString(),
					sale_id: this.newArr3.toString(),
				}).then(res => {
					// console.log(res);
					uni.showToast({
						title: '改派成功',
						icon: 'none',
						duration: 2000
					})
				})
				setTimeout(() => {
					this.$refs.popup.close();
					this.$parent.getFull()
				})
			},
			/*获取普通工程师名称列表*/
			async getEngineerNameList(nickname) {
				await this.$https.post('/hospital/getengineer', {
					nickname,
				}).then(res => {
					if (res.code === 1) {
						if (this.reassignment == '') {
							this.reassignment = this.reassignment.concat(res.data)
							this.reassignment = this.reassignment.map(v => {
								return {
									value: v.id,
									label: v.nickname
								}
							})
							console.log(this.reassignment, '========================')
						}
					}
				})

				await this.$https.post('/hospital/gethxengineer', {
					nickname,
				}).then(res => {
					if (res.code === 1) {
						if (this.reassignNew == '') {
							this.reassignNew = this.reassignNew.concat(res.data)
							this.reassignNew = this.reassignNew.map(v => {
								return {
									value: v.id,
									label: v.nickname
								}
							})

						}
					}
				})
				await this.$https.post('/hospital/getsale',{nickname}).then(res => {
					if (res.code === 1) {
						if (this.reassignNew2 == '') {
							this.reassignNew2 = this.reassignNew2.concat(res.data)
							this.reassignNew2 = this.reassignNew2.map(v => {
								return {
									value: v.id,
									label: v.nickname
								}
							})
				
						}
					}
				})
			},
			switchChange(id) {
				this.$https.post('/warranty/pause', {
					warranty_id: id,
				}).then(res => {
					if (res.code === 1) {
						this.$parent.getFull()
					}
				})
			},
			jumpDetail(id) {
				this.$parent.jump_detail(id)
			},
			/*获取工单号*/
			transform(id) {
				this.id = id
			},
			/*获取工程师id*/
			// change(e) {
			// 	this.value = e
			// 	console.log(this.value);
			// },
			change(item, value) {
				this.tval = value;
				console.log(this.tval, '========================')
			},
			changeNew(item, value) {
				this.tvalNew = value;
			},
			change(item, value, a) {
				switch (a) {
					case 1:
						this.tval = value;
						break;
					case 2:
						this.tvalNew = value;
						break;
					case 3:
						this.tvalNew2 = value;
						break;
					default:
						break;
				}
				console.log(this.tval,'8888888888888', this.tvalNew)
			},
			open() {

				this.getEngineerNameList()
				// 通过组件定义的ref调用uni-popup方法 ,如果传入参数 ，type 属性将失效 ，仅支持 ['top','left','bottom','right','center']
				this.$refs.popup.open('bottom')
			},
			call(phone) {
				uni.makePhoneCall({
					phoneNumber: phone,
					success: function() {
						console.log('拨打电话成功');
					},
					fail() {
						console.log('打电话失败了');
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	/deep/ .uni-select-cy .uni-select-cy-options {
		overflow: hidden !important;
	}

	.reassignment {
		width: 90%;
		display: flex;
		flex-direction: column;
		height: 780rpx;
		background-color: #fff;
		padding: 40rpx;
		margin-bottom: -70rpx;
	}

	.choose {
		height: 50rpx;
		margin: 0rpx 20rpx 30rpx 0;
	}

	.line {
		margin-top: 10rpx;
		border-left: 4rpx solid blue;
	}

	.text {
		margin-left: 10rpx;
		line-height: 54rpx;
	}

	/deep/.uni-stat__select {
		width: 89% !important;
		margin: 20rpx;
	}

	.submit-btn {
		border-radius: 52rpx;
		margin-top: 60rpx;
	}

	/deep/ .vue-ref {
		padding: 0 !important;
		border-bottom: 20px solid #fff;
	}

	.repair-card {
		background-color: #FFFFFF;

		border-radius: 8rpx;
		margin-bottom: 20rpx;

		.card-title {
			padding: 22rpx 20rpx;
			font-size: 32rpx;
			font-family: PingFang SC-Semibold, PingFang SC;
			font-weight: 600;
			color: #303030;
			display: flex;
			justify-content: space-between;
		}

		.card-content {
			position: relative;
			display: flex;
			flex-wrap: wrap;
			padding: 32rpx 20rpx 16rpx;
			border-top: 2rpx solid #f7f8fb;
			border-bottom: 2rpx solid #f7f8fb;
			font-size: 24rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			color: #969699;

			.finiash {
				position: absolute;
				width: 80rpx;
				height: 80rpx;
				right: 30rpx;
				top: -80rpx;
				transform: rotate(-8deg);
			}

			.card-content-item {
				width: 50%;

				.attribute {
					display: inline-block;
					color: #303030;
					margin-bottom: 12rpx;
				}
			}
		}

		.point_icon2 {
			width: 18rpx;
			height: 22rpx;
			margin-top: 8rpx;
		}

		.card-time {
			font-size: 24rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			color: #646466;
			padding: 22rpx 20rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;

			&-close {
				padding: 8rpx 32rpx;
				font-size: 28rpx;
				margin-left: 8rpx;
				border-radius: 52rpx;
				background: #E8F3FC;
				color: #1A66FF;
			}
			&-open {
				padding: 10rpx 32rpx;
				font-size: 27rpx;
				margin-left: 14rpx;
				border-radius: 52rpx;
				background: #fff;
				border: 2rpx solid #E8EBF2;
				color: #969699;
			}
			&-change {
				font-size: 27rpx;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				color: $public-oclor;
				padding: 6rpx 32rpx;
				border-radius: 52rpx;
				margin-left: 10rpx;
				border: 3rpx solid $public-oclor;
			}

			&-right {
				padding: 10rpx 32rpx;
				background-color: $public-oclor;
				color: #FFFFFF;
				font-size: 26rpx;
				margin-left: 10rpx;
				border-radius: 52rpx;
			}
		}
	}
</style>